<template>
  <div class="mainos">
    <div class="main_spac1" style="padding-bottom: 5px">
      <div class="main_white padding10">
        <div class="main_crumbs boxdq">
          <div class="main_crumbs_l">
            <a href="javascript:;" @click="$router.back(-1)">
              <i class="el-icon-arrow-down"></i>返回
            </a>
            <em>|</em>
            <span>查看报价</span>
          </div>
        </div>
        <div class="main_tile boxdq marginTop10">
          <div class="main_tile_l marginLeft0"><em></em>报价详情</div>
        </div>
        <div class="main_xq">
          <ul class="boxha">
            <li>
              单号：<span>{{ info.order_sn }}</span>
            </li>
            <li>
              用户：<span>{{ info.uids }}</span>
            </li>
            <li>
              开始时间：<span>{{
                parseTime(info.start_time, "{y}-{m}-{d}")
              }}</span>
            </li>
            <li>
              结束时间：<span>{{
                parseTime(info.end_time, "{y}-{m}-{d}")
              }}</span>
            </li>
            <li>
              状态：<span>{{
                info.status == 1
                  ? "正常"
                  : info.status == 0
                  ? "已取消"
                  : "已失效"
              }}</span>
            </li>
            <li>
              创建时间：<span>{{
                parseTime(info.created_at, "{y}-{m}-{d}")
              }}</span>
            </li>
            <li class="main_w100">
              备注：<span>{{ info.remark }}</span>
            </li>
          </ul>
        </div>
        <div class="main_tile boxdq marginTop10">
          <div class="main_tile_l marginLeft0"><em></em>商品详情</div>
        </div>
        <div class="main_table marginTop0" style="min-height: 530px">
          <el-table
            ref="multipleTable"
            v-loading="listLoading"
            :data="info.lists"
            element-loading-text="加载中"
            fit
            highlight-current-row
          >
            <el-table-column
              label="商品名称"
              prop="goods.name"
              class-name="main_hei"
            />
            <el-table-column
              label="单位"
              prop="spu.spu_unit.title"
              class-name="main_hei"
            />
            <el-table-column
              label="近一次采购价"
              prop="purchase_price"
              class-name="main_hei"
            >
              <template slot-scope="scope">
                <span
                  :style="{
                    color:
                      parseFloat(scope.row.purchase_price) >
                      parseFloat(scope.row.price)
                        ? 'red'
                        : '',
                  }"
                >
                  {{ scope.row.purchase_price }}</span
                >
              </template>
            </el-table-column>

            <el-table-column label="报价" prop="price" class-name="main_hei" />
          </el-table>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { cycle_info } from "@/api/user/userQuotation";
import { apiUrl, objKeySort, Md5 } from "@/utils/public";
import { parseTime } from "@/utils/index";

export default {
  components: {},
  data() {
    return {
      // 时间
      parseTime,
      // 基本信息
      info: {
        start_time: "2020-10-20",
        end_time: "2020-10-20",
        created_at: "2020-10-20",
      },
      listLoading: false,
      // id
      id: this.$route.params.id,
    };
  },
  created() {
    // 基本信息
    this.cycle_info();
  },
  methods: {
    // 基本信息
    cycle_info() {
      let data = Object.assign(
        {
          sign: Md5(
            objKeySort(Object.assign(apiUrl().name, { id: this.id })) +
              apiUrl().appsecret
          ),
        },
        apiUrl().name,
        { id: this.id }
      );
      cycle_info(data).then((res) => {
        if (res.errcode == 0) {
          let members = res.data.info.members.map((e) => e.nickname);
          res.data.info.uids = members.join("，");
          this.info = res.data.info;
        } else {
          this.$message.error(res.errmsg);
        }
      });
    },
  },
};
</script>
<style lang="scss" scoped>
@import "@/styles/variables.scss";

.mainos {
  .main_tile {
    .mainos_tile_r {
      color: $colour_red;
      font-size: $font_14;
    }
  }
}
</style>
